import h from "./mySnabbodm/h";
import patch from "./mySnabbodm/patch";

const container = document.getElementById("container");
const btn = document.getElementById("btn");

// console.log(
//   h("div", {}, [
//     h("div", {}, "child1"),
//     h("div", {}, "child2"),
//     h("div", {}, h("div", {}, "child3")),
//   ])
// );

const vnode = h("div", {}, [
  h("p", { key: "A" }, "A"),
  h("p", { key: "C" }, "C"), 
  h("p", { key: "B" }, "B"),
]);

// 第一次上树
patch(container, vnode);

// 新节点
const newVnode = h("div", {}, [
  h("p", { key: "A" }, "A"),
  h("p", { key: "C" }, "C"), 
  h("p", { key: "B" }, "B"),
]);

console.log(newVnode);

btn.onclick = function () {
  patch(vnode, newVnode);
};


// let c = document.getElementsByTagName('p')[1]
// let b = document.getElementsByTagName('p')[2]
// let parentElm = document.getElementsByTagName('div')[0]

// console.log(c, parentElm, b.nextSibling);
// parentElm.insertBefore(c, b.nextSibling)
